import { Button, Card, Form, Input, NavBar, Toast } from "antd-mobile";
import { useNavigate } from "react-router-dom";
import { putInfoAPI } from "../../services/info";
import res from "antd-mobile-icons/es/AaOutline";

function UserInfo() {
  const nav = useNavigate();

  return (
    <>
      <NavBar onBack={() => nav("/user")}>好大夫</NavBar>

      <Card>
        <Form
          layout="horizontal"
          onFinish={(v) => {
            console.log(v);
            v
              ? putInfoAPI(v).then((res) => {
                  console.log(res);
                  res.success ? Toast.show({ content: "修改成功" }) : null;
                  nav("/user");
                })
              : null;
          }}
        >
          <Form.Item
            name="nickName"
            label="昵称："
            rules={[{ required: true, message: "用户名不能为空" }]}
          >
            <Input placeholder="请输入用户名" />
          </Form.Item>
          <Form.Item name="mobile" label="电话：">
            <Input placeholder="请输入电话" />
          </Form.Item>
          <Form.Item name="address" label="地址：">
            <Input placeholder="请输入地址" />
          </Form.Item>
          <Form.Item>
            <Button color="primary" type="submit">
              提交
            </Button>
          </Form.Item>
        </Form>
      </Card>
    </>
  );
}

export default UserInfo;
